<template>
	<!-- 地址管理 -->
	<view>
		<!-- #ifdef APP-PLUS -->
		<view class="status_bar"></view>  
		<!-- #endif -->
		<navbar title="收货地址" />
		<noData v-if="addressList.length === 0" />
		<view class="main" v-else>
			<block v-for="(item,index) in addressList" :key="index">
				<view class="addressinfo" @click="selectAddress(item)">
					<view class="addressinfo_top">
						<view class="addressinfo_name">{{item.contact_name}}</view>
						<view class="addressinfo_phone">{{item.contact_phone}}</view>
					</view>
					<view class="addressinfo_address">{{item.province}}{{item.city}}{{item.district}}{{item.address}}</view>
					<view class="line"></view>
					<view class="addressinfo_bot">
						<view class="addressinfo_status1" v-if="item.is_master == 1" @click.stop="changeStatus(item)">
							<image src="/static/images/mine/switch2.png"></image>
							<text>默认地址</text>
						</view>
						<view class="addressinfo_status2" v-else @click.stop="changeStatus(item)">
							<image src="/static/images/mine/switch1.png"></image>
							<text>设为默认地址</text>
						</view>
						<view class="addressinfo_operation">
							<view class="addressinfo_edit" @click.stop="editAddress(item)">
								<image src="/static/images/mine/edit.png"></image>
								<text>编辑</text>
							</view>
							<view class="addressinfo_delete" @click.stop="deleteAddress(item.id)">
								<image src="/static/images/mine/del.png"></image>
								<text>删除</text>
							</view>
						</view>
					</view>
				</view>
			</block>

		</view>
		<view class="btn" @click="navAddAddress">
			<image src="/static/images/btnbg.png"></image>
			<text>新增收货地址</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				addressList:[]//地址列表
			}
		},
		onLoad(opt) {
			console.log(opt);
		},
		onShow() {
			this.getAddressList();
		},
		methods: {
			getAddressList() {
				this.$api.addresslist().then(res=>{
					this.addressList = res;
				})
			},
			//设为默认地址
			changeStatus(item){
				let is_master = '';
				if(item.is_master==0){
					is_master = 1;
				}else{
					is_master = 0;
				}
				this.$api.addressismaster({
					address_id:item.id,
					is_master
				}).then(res=>{
					this.getAddressList();
				})
			},
			//编辑
			editAddress(e){
				console.log(e);
				uni.navigateTo({
					url:'/pages/mine/addressManagement/addAddress?' + this.$url.urlEncode({
						id:e.id,
						contact_name:e.contact_name,
						contact_phone:e.contact_phone,
						province:e.province,
						city:e.city,
						district:e.district,
						address:e.address,
						is_master:e.is_master
					})
				})
			},
			//删除
			deleteAddress(address_id){
				uni.showModal({
					title:'温馨提示',
					content:'确认删除地址？',
					success: (res) => {
						if(res.confirm){
							console.log(address_id);
							this.$api.addressdel({address_id}).then(res=>{
								this.getAddressList();
							})
						}
					}
				})
			},
			//跳转添加地址
			navAddAddress(){
				uni.navigateTo({
					url:'/pages/mine/addressManagement/addAddress'
				})
			},
			//选择地址
			selectAddress(opt){
				console.log(opt);
				let page = getCurrentPages();
				let prevPage = page[page.length-2];
				let route = prevPage.route;
				if(route=='pages/mall/confirmOrder' || 'pages/package/takedelivery'){
					prevPage.$vm.addressInfo = opt;
					uni.navigateBack();
				}
			}
		}
	}
</script>

<style lang="scss">
page{
	padding: calc(var(--status-bar-height) + 100rpx) 0 30rpx;
}
.main{
	margin: 30rpx;
	
	.address_null{
		@include column-center;
		
		image{
			width: 85rpx;
			height: 25rpx;
			margin-top: 426rpx;
		}
		.text{
			font-size: 24rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #666666;
			margin-top: 16rpx;
		}
	}
	
	.addressinfo{
		width: 690rpx;
		background: $white;
		border-radius: 10rpx;
		padding: 30rpx;
		margin-bottom: 30rpx;
		
		&:last-child .line{
			display: none;
		}
		
		.addressinfo_top{
			@include align-center;
			
			.addressinfo_name{
				font-size: 28rpx;
				font-family: Source Han Sans CN;
				font-weight: bold;
				color: #333333;
			}
			.addressinfo_phone{
				font-size: 24rpx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: #333333;
				margin-left: 58rpx;
			}
		}
		.addressinfo_address{
			font-size: 24rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #666666;
			margin-top: 20rpx;
		}
		.addressinfo_bot{
			@include between;
			margin-top: 20rpx;
			
			.addressinfo_status1{
				display: flex;
				align-items: center;
				
				image{
					width: 70rpx;
					height: 60rpx;
				}
				text{
					font-size: 24rpx;
					font-family: Source Han Sans CN;
					font-weight: 400;
					color: $main_color;
					margin-left: 10rpx;
				}
			}
			.addressinfo_status2{
				display: flex;
				align-items: center;
				
				image{
					width: 70rpx;
					height: 60rpx;
				}
				text{
					font-size: 24rpx;
					font-family: Source Han Sans CN;
					font-weight: 400;
					color: #666666;
					margin-left: 10rpx;
				}
			}
			.addressinfo_operation{
				display: flex;
				align-items: center;
				
				image{
					width: 24rpx;
					height: 24rpx;
				}
				text{
					font-size: 24rpx;
					font-family: Source Han Sans CN;
					font-weight: 400;
					color: #666666;
					margin-left: 10rpx;
				}
				.addressinfo_delete{
					margin-left: 60rpx;
				}
			}
		}
		.line{
			width: 630rpx;
			height: 1rpx;
			background: #E5E5E5;
			margin: 30rpx 0;
		}
	}
}
.btn{
	@include center;
	position: fixed;
	bottom: 140rpx;
	left: 50%;
	transform: translateX(-50%);
	z-index:999;
	
	image{
		width: 560rpx;
		height: 70rpx;
	}
	text{
		font-size: 30rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #FFFFFF;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
	}
}
</style>
